﻿<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="UTF-8">
    <title>超市账单管理系统</title>
    <link rel="stylesheet" href="css/public.css"/>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<!--头部-->
<header class="publicHeader">
    <h1>超市账单管理系统</h1>

    <div class="publicHeaderR">
        <p><span>下午好！</span><span style="color: #fff21b" th:text="${username}"></span> , 欢迎你！</p>
        <a href="/logout">退出</a>
    </div>
</header>
<!--时间-->
<section class="publicTime">
    <span id="time">2015年1月1日 11:11  星期一</span>
    <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
</section>
<!--主体内容-->
<section class="publicMian ">
    <div class="left">
        <h2 class="leftH2"><span class="span1"></span>功能列表 <span></span></h2>
        <nav>
            <ul class="list">
                <li id="active"><a href="/billList">账单管理</a></li>
                <li><a href="/providerList">供应商管理</a></li>
                <li><a href="/userList">用户管理</a></li>
                <li><a href="/password">密码修改</a></li>
                <li><a href="/login">退出系统</a></li>
            </ul>
        </nav>
    </div>
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>账单管理页面 >> 订单添加页面</span>
        </div>
        <div class="providerAdd">
            <!--            //将表单中的数据提交到 对应的请求地址 （C层 在其中进行逻辑操作）-->
            <!--            //提交方式 post-->
            <form action="/billAdd" method="post">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                &nbsp;<span></span>
                <span style="color: red" th:text="${message}"></span>
                <!--div的class 为error是验证错误，ok是验证成功-->
                <div class="">
                    <label for="billId">订单编码：</label>
                    <!--                    //name="billId" 名字要与Enity中的名字一摸一样 否则在传参数的时候对应不到-->
                    <!--                    //请求地址也是（一摸一样）-->
                    <input type="text" name="billId" id="billId" required/>
                    <span>*请输入订单编码</span>
                </div>
                <div>
                    <label for="billName">商品名称：</label>
                    <input type="text" name="goodsName" id="billName" required/>
                    <span>*请输入商品名称</span>
                </div>
                <!--                <div>-->
                <!--                    <label for="billCom">商品单位：</label>-->
                <!--                    <input type="text" name="billCom" id="billCom" required/>-->
                <!--                    <span>*请输入商品单位</span>-->
                <!--                </div>-->
                <!--                <div>-->
                <!--                    <label for="billNum">商品数量：</label>-->
                <!--                    <input type="text" name="billNum" id="billNum" required/>-->
                <!--                    <span>*请输入大于0的正自然数，小数点后保留2位</span>-->
                <!--                </div>-->
                <div>
                    <label for="money">总金额：</label>
                    <input type="text" name="billAmount" id="money" required/>
                    <span>*请输入大于0的正自然数，小数点后保留2位</span>
                </div>

                <!--                <div>-->
                <!--                    <label>供应商：</label>-->

                <!--                    <input type="text" name="supplier">-->

                <!--                    &lt;!&ndash;                    <select name="supplier" >&ndash;&gt;-->
                <!--                    &lt;!&ndash;                        <option value="">&#45;&#45;请选择相应的提供商&#45;&#45;</option>&ndash;&gt;-->
                <!--                    &lt;!&ndash;                        <option value="">北京市粮油总公司</option>&ndash;&gt;-->
                <!--                    &lt;!&ndash;                        <option value="">邯郸市五得利面粉厂</option>&ndash;&gt;-->
                <!--                    &lt;!&ndash;                    </select>&ndash;&gt;-->
                <!--                    <span>*请选择供应商</span>-->
                <!--                    <span style="color: red" th:text="${addError}"></span>-->
                <!--                </div>-->

                <!--                <div>-->
                <!--                    <label>供应商：</label>-->
                <!--                    <select name="supplier" id="providerListSelect">-->
                <!--                        <option value="providerList[i].code">请选择</option>-->
                <!--                    </select>-->
                <!--                    <span>&nbsp;&nbsp;&nbsp;*请选择供应商</span>-->
                <!--                    <span style="color: red" th:text="${error}"></span>-->
                <!--                </div>-->


                <div>
                    <label>供应商：</label>
                    <select name="supplier">
                        <option>--请选择--</option>
                        <option
                                th:each="provider:${providerList}"
                                th:value="${provider.code}"
                                th:text="${provider.supplierName}"
                        >${provider.supplierName}
                        </option>
                    </select>
                    <span>&nbsp;&nbsp;&nbsp;*请选择供应商</span>
                    <span style="color: red" th:text="${error}"></span>
                </div>


                <div>
                    <label>是否付款：</label>
                    <!--                    //value 真正传入表单中的值   1   /  0-->
                    <input type="radio" value="2" name="isPayment" checked/>未付款
                    <input type="radio" value="1" name="isPayment"/>已付款
                </div>
                <div class="providerAddBtn">
                    <!--<a href="#">保存</a>-->
                    <!--<a href="billList.html">返回</a>-->
                    <input type="submit" value="保存"/>
                    <input type="button" value="返回" onclick="history.back(-1)"/>
                </div>
            </form>
        </div>

    </div>
</section>
<footer class="footer">
</footer>
<script src="js/time.js"></script>
<script src="js/jquery.js"></script>


<!--<script type="text/javascript">-->

<!--    $(document).ready(function () {-->

<!--        var url = "/getProviderList"; //访问后台去数据库查询select的选项,此处需填写后台接口路径-->

<!--        $.ajax({-->
<!--            type: "get",-->
<!--            url: url,-->
<!--            success: function (providerList) {-->
<!--                var unitObj = document.getElementById("providerListSelect"); //页面上的<html:select>元素-->
<!--                if (providerList != null) { //后台传回来的select选项-->
<!--                    for (var i = 0; i < providerList.length; i++) {-->
<!--                        //遍历后台传回的结果，一项项往select中添加option-->
<!--                        unitObj.options.add(new Option(providerList[i].supplierName, providerList[i].code));-->
<!--                    }-->
<!--                }-->
<!--            },-->
<!--            error: function () {-->
<!--                J.alert('Error');-->
<!--            }-->
<!--        })-->

<!--    })-->


<!--</script>-->

</body>
</html>